<template>
	<view>
		<view style="" class="back_header">
			<view @click="backimg">
				<u--image :showLoading="true" src="/static/imgs/backimg.png" width="12rpx" height="22rpx"
					style="margin-left: 32rpx;"></u--image>
			</view>
			<view class="back_header_name">填写预约信息</view>
		</view>
		<view class="pageDiv">
			<view>
				<u--form labelPosition="top" labelWidth="auto" :model="model1">
					<u-form-item label="证件类型" prop="userInfo.documenttype" @click="show = true">
						<u--input placeholder="请选择证件类型" border="surround" v-model="model1.userInfo.documenttype_of"
							style="background: #EEEEEE;" suffixIcon="arrow-down-fill" disabled></u--input>
					</u-form-item>
					<u-form-item label="证件号码" prop="userInfo.identificationnumber">
						<u--input placeholder="请输入证件号码" border="surround" v-model="model1.userInfo.identificationnumber"
							style="background: #EEEEEE;" maxlength="50"></u--input>
					</u-form-item>
					<u-form-item label="预约密码" prop="userInfo.reservationpassword">
						<u--input placeholder="请输入预约密码" border="surround" v-model="model1.userInfo.reservationpassword"
							style="background: #EEEEEE;" maxlength="50"></u--input>
					</u-form-item>
				</u--form>
				<view class="yybutton" @click="yyClick(idssFlag)">{{idssFlag == 'add' ? '预约' : '确认修改'}}</view>
			</view>

			<view>
				<u-popup :show="show" mode="center" @close="close" @open="open" :round="10">
					<view class="popup">
						<view style="display: flex;justify-content: flex-end;margin: 30rpx 30rpx 32rpx 0;"
							@click="show = false">
							<u--image :showLoading="true" src="/static/imgs/chimg.png" width="40rpx" height="40rpx"
								style="margin-right: 14rpx;"></u--image>
						</view>
						<view class="u-demo-block">
							<view class="u-demo-block__title">选择证件类型</view>
							<view>
								<view class="u-page__radio-item">
									<u-radio-group v-model="documenttype" :borderBottom="true" placement="column"
										iconPlacement="right" @change="groupChange">
										<u-radio :customStyle="{marginBottom: '16px'}"
											v-for="(item, index) in radiolist7" :key="index" :label="item.name"
											:name="item.name">
										</u-radio>
									</u-radio-group>
								</view>
							</view>
						</view>
					</view>
				</u-popup>
			</view>
		</view>
	</view>

</template>

<script>
	import {
		addOrders,
		editOrders
	} from "@/api/user.js"
	export default {
		name: "express",
		data() {
			return {
				idssFlag: '',
				documenttype: '', // 证件类型
				//横向两端排列形式数据
				radiolist7: [{
						name: '港澳居民来往内地通行证',
						disabled: false
					},
					{
						name: '台湾居民来往大陆通行证',
						disabled: false
					},
					{
						name: '往来港澳通行证',
						disabled: false
					},
					{
						name: '护照',
						disabled: false
					},
				],
				value: '',
				show: false,
				showSex: false,
				model1: {
					userInfo: {
						documenttype: '',
						documenttype_of: '',
						identificationnumber: '',
						reservationpassword: '',
					},
				},
				actions: [{
						name: '男',
					},
					{
						name: '女',
					},
					{
						name: '保密',
					},
				],
				rules: {
					'userInfo.name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'userInfo.sex': {
						type: 'string',
						max: 1,
						required: true,
						message: '请选择男或女',
						trigger: ['blur', 'change']
					},
				},
				radio: '',
				switchVal: false
			}
		},

		async onLoad(options) {
			let idss = JSON.parse(options.idss);
			let that = this;
			that.idssFlag = idss;
			if (idss == 'update') {
				let orderList = JSON.parse(uni.getStorageSync('orderList'));
				console.log("orderList", orderList)
				that.model1.userInfo.documenttype = orderList.documenttype;
				that.model1.userInfo.identificationnumber = orderList.identificationnumber;
				that.model1.userInfo.reservationpassword = orderList.reservationpassword;
				if (orderList.documenttype == '0') {
					that.model1.userInfo.documenttype_of = '港澳居民来往内地通行证';
				} else if (orderList.documenttype == '1') {
					that.model1.userInfo.documenttype_of = '台湾居民来往大陆通行证';
				} else if (orderList.documenttype == '2') {
					that.model1.userInfo.documenttype_of = '往来港澳通行证';
				} else if (orderList.documenttype == '3') {
					that.model1.userInfo.documenttype_of = '护照';
				}
				that.documenttype = that.model1.userInfo.documenttype_of;
			}
			console.log("idss", idss)
			// this.id = options.id;
			// const res = await request('tihuo', 'getExpress', {
			// 	id: this.id
			// }, {
			// 	showLoading: true
			// });
			// console.log("res", res)
			// this.wlInfo = res;
		},

		methods: {
			groupChange(n) {
				let that = this;
				that.documenttype = n;
				that.model1.userInfo.documenttype_of = n;
				if (n == '港澳居民来往内地通行证') {
					that.model1.userInfo.documenttype = '0';
				} else if (n == '台湾居民来往大陆通行证') {
					that.model1.userInfo.documenttype = '1';
				} else if (n == '往来港澳通行证') {
					that.model1.userInfo.documenttype = '2';
				} else if (n == '护照') {
					that.model1.userInfo.documenttype = '3';
				}
				that.show = false;
				console.log('groupChange', n);
			},
			backimg() {
				uni.navigateTo({
					url: '/pages/order/orderList'
				});
			},
			yyClick(idssFlag) {
				let that = this;
				if (that.model1.userInfo.documenttype_of == '') {
					uni.showToast({
						title: '请选择证件类型',
						icon: 'none',
					});
					return false;
				} else if (that.model1.userInfo.identificationnumber == '') {
					uni.showToast({
						title: '请输入证件号码',
						icon: 'none',
					});
					return false;
				} else if (that.model1.userInfo.reservationpassword == '') {
					uni.showToast({
						title: '请输入预约密码',
						icon: 'none',
					});
					return false;
				}
				if (idssFlag == 'add') {
					that.addOrders();
				} else if (idssFlag == 'update') {
					that.editOrders();
				}


				// uni.navigateTo({
				// 	url: '/pages/order/orderList'
				// });
			},
			addOrders() {
				let userInfo = '';
				if (uni.getStorageSync('userInfoList')) {
					userInfo = JSON.parse(uni.getStorageSync('userInfoList'));
				}
				let data = {
					// __token__: '2f8672f4e545c3212489e0cbad6447df',
					documenttype: this.model1.userInfo.documenttype,
					identificationnumber: this.model1.userInfo.identificationnumber,
					reservationpassword: this.model1.userInfo.reservationpassword,
					businessid: userInfo.businessid
				}
				addOrders(data).then(res => {
					if (res.code == "success") {
						setTimeout(() => {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/order/orderList'
								});
							}, 500)
						}, 100)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				})
			},
			editOrders() {
				let orderList = JSON.parse(uni.getStorageSync('orderList'));
				console.log("orderList", orderList)
				let data = {
					// __token__: '2f8672f4e545c3212489e0cbad6447df',
					order_id: orderList.id,
					documenttype: this.model1.userInfo.documenttype,
					identificationnumber: this.model1.userInfo.identificationnumber,
					reservationpassword: this.model1.userInfo.reservationpassword
				}
				editOrders(data).then(res => {
					if (res.code == "success") {
						setTimeout(() => {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/order/orderList'
								});
							}, 500)
						}, 100)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
					console.log(res, 'editOrders')
				})
			},
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			}
		}
	}
</script>
<style lang="less" scoped>
	/deep/ .u-form-item__body__left__content__label {
		font-size: 30rpx !important;
		font-family: PingFang SC;
		font-weight: 500;
		color: #4D4D4D;
	}

	/deep/.u-border-bottom {
		border-bottom-width: 1rpx !important;
		border-color: #B3E0FF !important;
		border-bottom-style: solid;
	}

	@import 'assets/style/order.rpx.less';
</style>
